<template>
	<view class="join-page">
		<nodate v-if="list.length<1" />
		<template v-else>
			<u-card margin="20rpx" v-for="(el,i) in list" :key="i">
				<view class="u-flex u-row-between" slot="head">
					<text class="u-font-34 yu-bold">{{el.lessioninfo}}</text>
					<u-tag text="未缴费" mode="plain" type="error" v-if="el.orderstatus==0" />
					<u-tag text="已缴费" mode="plain" type="success" v-if="el.orderstatus==1" />
				</view>
				<view class="u-flex u-row-between" slot="body">
					<u-image width="200rpx" height="200rpx" :src="el.img ? $api.json('baseUrl')+'/upload/' + el.img : '../../static/textbook.png'"></u-image>
					<view class="">
						<view class="u-font-34  yu-bold u-p-b-30">
							<text class="u-font-30">学生：</text>{{el.stuname}}
						</view>
						<view class="u-font-34  yu-bold">
							<text class="u-font-30">老师：</text>{{el.empname}}
						</view>
					</view>
					<view class="">
						<u-circle-progress active-color="#ff9900" :percent="Math.floor(el.usedtimes * 100 / el.alltimes)">
							<view class="yu-flex yu-flex-col">
								<view>进度</view>
								<view>{{el.usedtimes + '/'+ el.alltimes}}</view>
							</view>
						</u-circle-progress>
					</view>
				</view>
				<view class="u-flex u-row-between" slot="foot">
					<u-icon name="clock-fill" size="34" color="" :label="el.createtime"></u-icon>
					<u-icon name="trash-fill" size="34" color="red" label="删除" @click="delitem(el.paymentid)"></u-icon>
				</view>
			</u-card>
		</template>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: []
			};
		},
		onLoad() {
			this.getData()
		},
		onPullDownRefresh() {
			this.getData()
		},
		methods: {
			getData() {
				uni.showLoading({
					title: '加载中'
				});
				uni.request({
					method: 'POST',
					url: this.$api.json('baseUrl') + '/payment/h5findPaymentLog', //仅为示例，并非真实接口地址。
					data: {},
					success: (res) => {
						uni.hideLoading()
						uni.stopPullDownRefresh();
						if (res.data.resultCode === '000000') {
							this.list = res.data.data
						} else if (res.data.resultCode === '200009') {
							uni.redirectTo({
								url: '/pages/login/login'
							})
						} else {
							this.$api.msg(res.errMsg);
						}
					}
				})
			},
			delitem(id) {
				uni.showModal({
					title: '提示',
					content: '确定删除课程？',
					success: (res) => {
						if (res.confirm) {
							uni.request({
								method: 'POST',
								url: this.$api.json('baseUrl') + '/payment/h5delPaymentLog', //仅为示例，并非真实接口地址。
								data: {
									paymentid: id
								},
								success: (res) => {
									if (res.data.resultCode === '000000') {
										this.$api.msg(res.data.resultInfo);
										this.getData()
									} else if (res.data.resultCode === '200009') {
										uni.redirectTo({
											url: '/pages/login/login'
										})
									} else {
										this.$api.msg(res.data.resultInfo);
									}
								}
							})
						} else if (res.cancel) {

						}
					}
				});

			}
		}
	}
</script>

<style lang="less">
	.join-page {}
</style>
